<template>
  <view class="order-content">
    <view class="order-detail mb40">
      <view class="fs30 mb30 fb">订单信息</view>
      <view class="flex flex-m mb20">
        <view class="label mr20">订单状态</view>
        <view class="fs24">{{ info.statusName }}</view>
      </view>
      <view class="flex flex-m mb20">
        <view class="label mr20">订单编号</view>
        <view class="fs24">{{ info.orderNo }}</view>
      </view>
      <view class="flex flex-m mb20">
        <view class="label mr20">订单时间</view>
        <view class="fs24">{{ info.orderTime }}</view>
      </view>
      <view class="flex flex-m mb20">
        <view class="label mr20">购买手机</view>
        <view class="fs24">{{ info.mobile }}</view>
      </view>

      <view class="flex flex-m mb20" v-if="info.backTime">
        <view class="label mr20">{{
          obj.showStatus ? '退票时间' : '退款时间'
        }}</view>
        <view class="fs24">{{ info.backTime }}</view>
      </view>
      <view class="flex flex-m mb20" v-if="!!this.obj.showStatus">
        <view class="label mr20">订单金额</view>
        <view class="fs24">￥{{ info.money }}</view>
      </view>
    </view>
    <view class="pay-detail">
      <view class="fs30 mb30 fb">{{
        ['订单失败', '退货退款', '已退票'].includes(info.statusName)
          ? '退款信息'
          : '支付信息'
      }}</view>
      <!-- <view
        class="mb20 flex-w"
        v-if="info.discount && info.discount.length > 0"
      >
        <view class="label mr20">优惠券</view>
        <view>
          <view class="fs24" v-for="(item, index) in info.discount" :key="index"
            >{{ item.couponName }}
            <text>({{ item.couponId }})</text>
            <text v-if="item.difference !== '0.00'"
              >,补差￥{{ item.difference }}</text
            ></view
          >
        </view>
      </view> -->
      <view class="flex flex-m mb20" v-if="info.backTime">
        <view class="label mr20">退款金额</view>
        <view class="fs24"
          >￥{{ info.money
          }}<text
            v-if="
              (info.couponName && info.saleTotalPrice) ||
              (info.discount && info.discount.length > 0)
            "
            >(所用券已退回,可在电影券中查看)</text
          ></view
        >
      </view>
      <!-- <view
        class="flex flex-m mb20"
        v-if="obj.couponPayPrice && obj.couponPayPrice > 0"
      >
        <view class="label mr20">立减券</view>
        <view class="fs24">-￥{{ obj.couponPayPrice }}</view>
      </view> -->
      <!-- <view
        class="flex flex-m mb20"
        v-if="!['订单失败', '退货退款', '已退票'].includes(info.statusName)"
      >
        <view class="label mr20">微信支付</view>
        <view class="fs24"
          >￥{{ info.money
          }}<text v-if="info.saleTotalPrice"
            >(购票补差￥{{ info.money }},购券金额详见商品订单)</text
          ></view
        >
      </view> -->
      <!-- 支付信息统合payinfo -->
      <view
        v-for="(item, index) in obj.payInfo"
        :key="index"
        class="flex flex-m mb20"
      >
        <view class="label mr20">{{ item.name }}</view>
        <view class="fs24">{{ item.value }}</view>
      </view>
      <view
        class="flex flex-m mb20"
        v-if="info.backTime && info.money !== '0.00'"
      >
        <view class="label mr20">到账时间</view>
        <view class="fs24">预计24小时内到账</view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    props: {
      customClass: {
        type: String
      },
      obj: {
        type: Object,
        default: () => {
          return {}
        }
      }
    },
    data() {
      return {}
    },
    methods: {
      handleClick() {
        this.$emit('click')
      }
    },
    computed: {
      info() {
        console.log('info', this.obj)
        const obj = {
          orderNo: this.obj.orderNo,
          orderTime: this.obj.orderTime,
          mobile: this.obj.mobile
        }
        if (this.obj.showStatus) {
          const statusName =
            +this.obj.showStatus === 5
              ? '已退票'
              : +this.obj.orderStatus === 4
              ? '订单成功'
              : '订单失败'
          return {
            statusName,
            backTime: this.obj.backTicketTime,
            money: this.obj.thirdMoney,
            discount: this.obj.discount,
            saleTotalPrice: this.obj.saleTotalPrice,
            couponName: this.obj.couponName,
            ...obj
          }
        } else {
          const statusName =
            +this.obj.refundMoneyStatus === 1 && +this.obj.refundStatus === 1
              ? '退货退款'
              : this.obj.orderStatus === '0'
              ? '待支付'
              : '订单成功'
          return {
            statusName,
            backTime: this.obj.refundTime,
            money: this.obj.thirdMoney,
            ...obj
          }
        }
      }
    }
  }
</script>

<style lang="scss" scoped>
  .order-content {
    background: #fff;
    padding: 40rpx 30rpx;
    border-radius: 20rpx;
  }
  .label {
    font-size: 24rpx;
    width: 124rpx;
    color: #888;
  }
</style>
